<template>
    <div class="login">
        <p>查看全部团购</p>
        <div class="dl">
            <span>登录</span>
            <div class="cs">
                城市：<img src="" alt="">廊坊
            </div>
        </div>
        <ul>
            <li>首页</li>
            <span></span>
            <li>我的</li>
            <span></span>
            <li>美团下载</li>
            <span></span>
            <li>电脑版</li>
            <span></span>
            <li>帮助</li>
        </ul>
    </div>
</template>

<script>

export default {
    name: '',
    components: {

    }
}
</script>

<style lang="scss" scoped>
    .login{
        width: 96%;
        margin: 0 auto;
        p{
            font-size: 30px;
            color: #FE8C00;
            border-top: 2px solid #CECECE;
            border-bottom: 2px solid #CECECE;
            padding: 20px;
        }
        .dl{
            display: flex;
            height: 80px;
            justify-content: space-between;
            align-items: center;
            font-size: 26px;
            span{
                display: block;
                font-size: 26px;
                background-color: #FFC200;
                padding: 15px 35px;
                border-radius: 15px;
                margin-left: 30px;
            }
            .cs{
                margin-right: 30px;
            }
        }
        ul{
            list-style: none;
            display: flex;
            justify-content: space-around;
            align-items: center;
            font-size: 24px;
            color: #FE8C00;
            height: 40px;
            margin-top: 40px;
            margin-bottom: 50px;
            span{
                display: block;
                width: 1px;
                height: 20px;
                background-color: gray;
                border: 1px solid gray;
            }
        }
    }
</style>
